<template>
{{#if page.psSysPFPlugin}}
    {{> @macro/plugins/view/view-use.hbs appPlugin=page.psSysPFPlugin}}
{{else}}
  {{#if page.psViewLayoutPanel.useDefaultLayout}}
    <AppEXPViewLayout :class="classNames" :openType="openType">
        <template #viewHeaderContentLeft v-if="!noViewCaption && model.showCaption">
            <div class="view-header__left__caption">
                {{> @macro/view/view-caption.hbs}}
            </div>
        </template>
        <template #default>
            <AppSplit
                v-model="split"
                class="app-vc-expbar"
                mode="{{#eq page.sideBarLayout 'TOP'}}vertical{{else}}horizontal{{/eq}}"
                @move-end="handleSplitChange">
                <template #{{#eq page.sideBarLayout 'TOP'}}top{{else}}left{{/eq}}>
                    <div class="app-vc-expbar__{{#eq page.sideBarLayout 'TOP'}}top{{else}}left{{/eq}}">
                    {{#each page.ctrls as | ctrl |}}
                    {{#eq ctrl.controlType 'CALENDAREXPBAR'}}
                        {{> @macro/widgets/calendar-exp-bar-detail/calendar-exp-bar.hbs ctrl=ctrl page=page}}        
                    {{/eq}}
                    {{/each}}
                    </div>
                </template>
                <template #{{#eq page.sideBarLayout 'TOP'}}bottom{{else}}right{{/eq}}>
                    <div class="app-vc-expbar__body">
                        <component
                            v-if="store.navParam && store.navParam.navViewName"
                            openType="EMBED"
                            class="view-container2"
                            :is="store.navParam.navViewName"
                            :key="store.navParam.data.srfkey"
                            :context="store.navParam.navData.context"
                            :viewParams="store.navParam.navData.viewParams"
                            :pLoadingHelper="store.loadingHelper"                
							@view-init="(name:string, data:any) => { handleCtrlInit(controller, name, data); }"
							@view-action="(name:string, action:any, data:any) => { handleCtrlAction(controller, name, action, data); }"
							@view-destroy="(name:string, data:any) => { handleCtrlDestroy(controller, name, data); }">
                        </component>
                    </div>
                </template>
            </AppSplit>
        </template>
        {{> @macro/view/view-msg.hbs}}  
    </AppEXPViewLayout>
  {{else}}
    <div :class="classNames">
        {{#if page.psViewLayoutPanel.rootPSPanelItems}}
        {{#each page.psViewLayoutPanel.rootPSPanelItems as | panelItem |}}
        {{> @macro/widgets/panel-detail/include-panel.hbs type=panelItem.itemType item=panelItem isMultiData=false panel=page.psViewLayoutPanel page=page}}
        {{/each}}
        {{/if}}
    </div>
  {{/if}}
{{/if}}  
</template>
<script lang="ts" setup>
// 基于template/src/views/\{{appModules}}/\{{pages@DECALENDAREXPVIEW}}/\{{spinalCase page.codeName}}.vue.hbs生成
{{#if page.psViewLayoutPanel.useDefaultLayout}}
import { AppEXPViewLayout } from "@components/layout/exp-view-layout";
import { AppSplit } from '@components/common/split';
{{> @macro/widgets/ctrl/import-ctrl.hbs ctrls=page.ctrls}}
{{else}}
import { AppCtrlPos, AppScrollContainer, AppSimpleFlexContainer, AppStandardContainer, AppTabPanel, AppTabPage } from '@components/layout-element/structure';
{{#if page.psViewLayoutPanel.viewProxyMode}}
{{> @macro/widgets/ctrl/import-ctrl.hbs ctrls=page.psViewLayoutPanel.psControls}}
{{else}}
{{> @macro/widgets/ctrl/import-ctrl.hbs ctrls=page.ctrls}}
{{/if}}
{{/if}}
import { model } from "./{{spinalCase page.codeName}}-model";
import { 
    useNavParamsBind, 
    useEventBind, 
{{#and page.enableQuickGroup page.quickGroupPSCodeList}}
    handleQuickGroupValueChange,
{{/and}}  
{{#page.ctrls}}
  {{#eq controlType 'TOOLBAR'}}
    handleToolbarItemClick,
  {{/eq}}
{{/page.ctrls}}
    handleCtrlAction, 
    handleCtrlInit, 
    handleCtrlDestroy, 
    getViewClassNames, 
    initExpViewSplit, 
    setExpViewSplit,
{{#unless page.psViewLayoutPanel.useDefaultLayout}}
    handleComponentAction,
{{/unless}}
} from "@/hooks/use-view";
import { CalendarExpViewActionType, IContext, IParam, ICalendarExpViewAbility, ICalendarExpViewControllerParams, ICalendarExpViewStore, CalendarExpViewController, ICalendarExpViewController, ILoadingHelper, IEvent } from '@/core';

{{> @macro/view/view-props.hbs}}

{{> @macro/common/emit.hbs name="view" actionType="CalendarExpViewActionType" ability="ICalendarExpViewAbility"}}    

//  样式名称
const classNames = computed(() => {
    const classNames = getViewClassNames(model, props);
    Object.assign(classNames, {'deexpview': true});
    return classNames;  
});

const params: ICalendarExpViewControllerParams<CalendarExpViewActionType, ICalendarExpViewAbility> = { 
    name: props.name,
    model, 
    evt, 
    isLoadDefault: props.isLoadDefault,    
    openType:props.openType, 
    pLoadingHelper:props.pLoadingHelper, 
    handler: (data: ICalendarExpViewStore) => { return reactive(data); }
};

//  导航分隔值
const split = ref(0.45);
//  处理分隔值变化
const handleSplitChange = () => {
    setExpViewSplit(model, split.value);
}

const initSplit = () => {
    const instance = getCurrentInstance();
    if (instance && instance.vnode && instance.vnode.el) {
        split.value = initExpViewSplit(instance.vnode.el as HTMLElement, model) || 0.45;
    }
}

{{> @macro/common/controller.hbs name="view" IController="ICalendarExpViewController" store="ICalendarExpViewStore" ability="ICalendarExpViewAbility" controller="CalendarExpViewController" customMounted="initSplit();"}}
</script>